<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>TechNova - Product Order</title>
    <link rel="stylesheet" href="../css/styles.css">
</head>
<body>
    <div class="container">
        <!-- header.php -->
        <?php include '../common/header.php'; ?>
        
        <div class="product-order">
            <h1>Product Order</h1>
            
            <div class="product-list">
                <div class="product-item">
                    <img src="../images/ai-chip.jpg" alt="AI Chip">
                    <h2>AI Chip</h2>
                    <p>High-performance artificial intelligence processor, suitable for various AI application scenarios.</p>
                    <p class="price">$9999</p>
                    <button class="button add-to-cart">Add to Cart</button>
                </div>
                
                <div class="product-item">
                    <img src="../images/smart-home-set.jpg" alt="Smart Home Set">
                    <h2>Smart Home Set</h2>
                    <p>Includes smart speaker, smart bulbs and smart sockets, easily build a smart home.</p>
                    <p class="price">$1999</p>
                    <button class="button add-to-cart">Add to Cart</button>
                </div>
                
                <div class="product-item">
                    <img src="../images/blockchain-solutions.jpg" alt="Enterprise-level Blockchain Solution">
                    <h2>Enterprise Blockchain Solution</h2>
                    <p>Offers enterprises a secure and efficient blockchain platform for infra and app dev.</p> 
                    <p class="price">$9999</p>
                    <button class="button add-to-cart">Add to Cart</button>
                </div>
            </div>
            
            <div class="order-form">
                <h2>Product Order Form</h2>
                <form action="#" method="post">
                    <input type="text" name="name" placeholder="Your Name" required>
                    <input type="email" name="email" placeholder="Your Email" required>
                    <input type="tel" name="phone" placeholder="Your Phone" required>
                    <textarea name="order_details" placeholder="Please describe your order requirements in detail" required></textarea>
                    
                    <h3>Payment Methods</h3>
                    <div class="payment-methods">
                        <label>
                            <input type="radio" name="payment" value="credit_card" required>
                            Credit Card
                        </label>
                        <label>
                            <input type="radio" name="payment" value="bank_transfer" required>
                            Bank Transfer
                        </label>
                        <label>
                            <input type="radio" name="payment" value="alipay" required>
                            Alipay
                        </label>
                    </div>
                    
                    <button type="submit" class="button">Submit Order</button>
                </form>
            </div>
        </div>
    </div>
    
    <!-- footer.php -->
    <?php include '../common/footer.php'; ?>
</body>
</html>
